$(function () {
  // 获取商品id，根据id去后台获取对应的商品信息，渲染到页面中 
  var id = location.search.split('=')[1]; // 获取id  
  // 根据id 去获取对应商品数据 
  $.ajax({
    type: 'get',
    url: '/product/queryProductDetail',
    data: { id: id },
    dataType: 'json',
    success: function (res) {
      console.log(res);
      // 渲染
      $('.product-box').html(template('tmp', res));
      // 整个页面渲染完成后
      // 给轮播绑定相关事件 
      //获得slider插件对象
      var gallery = mui('.mui-slider');
      gallery.slider({
        interval: 5000//自动轮播周期，若为0则不自动播放，默认为0；
      });
      // 给数字输入框 绑定相关事件 
      mui('.mui-numbox').numbox();
    }
  })

  // 2- 尺码高亮排他效果 
  $('.product-box').on('click', '.lt_size span', function () {
    $(this).addClass('current').siblings().removeClass('current');
  })

  // 3- 加入购物车功能
  // 1- 用户点击添加购物车按钮， 获取商品的基本信息 商品id ，数量num, 尺码 size  
  // 2- 校验数据是合理，不合理提示错误，到此结束 
  // 3- 如果数据合理，ajax提交给后台 ，加入购物车 
  //     结果： 加入成功 ：  询问用户 是否去购物车 
  //            加入失败：   用户未登录， 跳转登录页 

  $('#addCart').click(function () {
    // 商品id ，数量num, 尺码 size  
    var num = $('.mui-numbox-input').val();
    var size = $('.lt_size .current').text();
    console.log(id, num, size);
    // 判断  if (flag == true) {... }
    if (!size) {
      mui.toast('请选择尺码');
      return;
    }
    // 把数据发送给后台 
    $.ajax({
      type: 'post',
      url: '/cart/addCart',
      data: {
        productId: id,
        size: size,
        num: num
      },
      dataType: 'json',
      success: function (res) {
        console.log(res);
        if (res.error) {
          // 去登陆
          location.href = "./login.html?reUrl=" + location.href;
        }
        if (res.success) {
          // 询问用户 是否去购物车 
          mui.confirm('添加购物车成功', '温馨提示', ['继续浏览', '去购物车'], function (e) {
            if (e.index == 1) {
              // 去购物车 
              location.href = './cart.html';
            }
          })
        }
      }
    })

  })

})